<template>
    <view class="content" style="padding-bottom:182rpx">
        <u-navbar :fixed="true" :shadow="true" :safeAreaInsetTop="true" :placeholder="true" @leftClick="back" title="班组长变更">
        </u-navbar>

        <!-- content -->
        <view class="uni-area">
            <view class="u-m-t-50 u-flex u-row-between">
                <text class="u-font-32 font-bold">班组基本信息</text>
                <text class="u-font-28 uni-higt-color" v-if="type=='add'" @tap.stop="menuSkip('/pages/team-bag/list?type=foreman')">选择班组</text>
            </view>
            <uni-item-team class="u-m-t-20" v-if="JSON.stringify(foremanGroup)!='{}'" :listItem="foremanGroup"></uni-item-team>

            <view class="u-m-t-50 u-flex u-row-between">
                <text class="u-font-32 font-bold">班组长变更信息</text>
                <text class="u-font-28 uni-higt-color" @tap.stop="selectForemanFn">选择新班组长</text>
            </view>
            <uni-leave class="u-m-t-20" v-if="JSON.stringify(selectForeman)!='{}'" :staffItem="selectForeman"> </uni-leave>

            <view class="u-m-t-50 u-font-32 font-bold">变更原因</view>
            <u--textarea class="u-m-t-30 textarea" v-model="foreman.bz" :autoHeight="false" :height="16" 
                placeholder="请输入内容" placeholderClass="uni-placeholder">
            </u--textarea>

            <!-- 附件 -->
            <uni-accessory class="u-m-t-50" :title="{title:'附件'}" :accessorys="accessoryList" :upload="true" :uploadParameter="uploadParameter" @uploadSucceed="uploadSucceed">
            </uni-accessory>

            <!-- 间隔 -->
            <u-gap height="30rpx" bgColor="#FBFCFC"></u-gap>
        </view>

        <!-- 底部操作 -->
        <view class="uni-bottom u-flex u-row-between">
            <u-button class="btn3" text="取消" @tap="back"></u-button>
            <u-button class="btn4" type="primary" :text="type=='add'?'保存':'修改'" @tap="submit"> </u-button>
        </view>
    </view>
</template>

<script>
import { mapGetters, mapMutations } from 'vuex'
export default {
    data() {
        return {
            type: 'add',
            foreman: { 
                busiId: '',
                searchTerminal: 'PC',
                bz: '', 
                xmbz: {}
            },
            accessoryList: [], // 附件
            uploadParameter: { // 上传附件的参数
                ywlx: 'salary_bzz_change',
            },
        }
    },

    computed: {
        ...mapGetters(['foremanGroup', 'selectForeman']),
    },

    watch: {
        foremanGroup(newVal, oldVal) {
            if (JSON.stringify(newVal) != '{}') {
                if( this.type == 'add' ){
                    this.foreman.xmbz = newVal
                    this.setSelectForeman({})
                } 
            }
        },
        selectForeman(newVal, oldVal) {
            if ( JSON.stringify(newVal) != '{}' ) {
                this.foreman.xmbz.bzzbh = newVal.id
                this.foreman.xmbz.bzzlxdh = newVal.lxfs
                this.foreman.xmbz.bzzxm = newVal.xm
                this.foreman.xmbz.bzzzjhm = newVal.zjhm
                this.foreman.xmbz.bzzzjlx = newVal.zjlx
            }
        },
    },



    onLoad(option) {
        if ( !option.id ) {
            this.type = 'add'
            this.getYwbh()
        }else{
            this.type = 'edit'
            this.foreman.busiId = option.id
            this.foremanDetail()
            this.getAccessoryList()
        }
    },

    onShow() { },

    methods: {
        ...mapMutations(['setForemanGroup', 'setSelectForeman']),
        // 返回
        back() {
            uni.navigateBack()
        },
        // 跳转
        menuSkip(url) {
            uni.navigateTo({ url: url })
        },




        // 获取业务编号
        getYwbh() {
            this.$request(this, this.$apis.GetYwbh, { ywlx: this.uploadParameter.ywlx }).then(res => {
                // console.log('业务编号',res)
                this.foreman.busiId = res
                this.getAccessoryList()
            }).then()
        },

        // 先选择班组
        // 再选择新班组长
        selectForemanFn() {
            if (this.foreman.xmbz.id) {
                this.menuSkip('/pages/member-bag/list?type=foreman&bzid=' + this.foreman.xmbz.id)
            } else {
                uni.$u.toast('请先选择班组')
            }
        },


        // 详情
        foremanDetail() {
            this.$request(this, this.$apis.groupChangeDetail, { id: this.foreman.busiId }).then(res => {
                console.log('详情', res)
                this.foreman.bz = res.bz
                this.foreman.xmbz = res.xmbz
                this.setForemanGroup({
                    bzmc: res.xmbz.bzmc,
                    qymc: res.xmbz.deptName,
                    bzzxm: res.xmbz.bzzxm,
                    bzzlxdh: res.xmbz.bzzlxdh,
                    cyrs: res.xmbz.cyrs,
                })
                const test = [
                    { field: 'bzzbh' , title:'id', value:'' },
                    { field: 'bzzxm' , title:'xm', value:'' },
                    { field: 'bzzxb' , title:'xb', value:'' },
                    { field: 'bzzlxfs' , title:'lxfs', value:'' },
                    { field: 'bzzzjhm' , title:'zjhm', value:'' },
                    { field: 'bzzzjlx' , title:'zjlx', value:'' },
                ]
                res.hisChange.map((v,i)=>{
                    test.map((a,b)=>{
                        if( v.bgzd == a.field ) a.value = v.bgh
                    })
                })
                this.setSelectForeman({
                    id: test[0].value,
                    xm: test[1].value,
                    xb: test[2].value,
                    lxfs: test[3].value,
                    zjhm: test[4].value,
                    zjlx: test[5].value,
                })
            }).then()
        },


        // 保存
        submit() {
            if (!this.foreman.xmbz.id) {
                uni.$u.toast('请选择班组')
                return false
            }
            if (JSON.stringify(this.selectForeman)=='{}') {
                uni.$u.toast('请选择新班组长')
                return false
            }
            if (!this.foreman.bz) {
                uni.$u.toast('请输入变更班组长变更原因')
                return false
            }
            uni.showLoading({ title: '保存中' })
            let api 
            if( this.type == 'edit' ) {
                api = this.$apis.groupChangeEdit
            }else{
                api = this.$apis.groupChangeSave
            }
            this.$request(this, api, this.foreman).then(res => {
                this.setForemanGroup({})
                this.setSelectForeman({})
                uni.navigateBack()
            }).then()
        },



        // 附件列表
        getAccessoryList() {
            const parameter = {
                ywlx: this.uploadParameter.ywlx, // 业务类型
                ywbh: this.foreman.busiId, // 业务编号
            }
            uni.showLoading({ title: '附件列表获取中' })
            this.$request(this, this.$apis.MemberAtta, parameter).then(res => {
                this.accessoryList = res
                if (res) {
                    this.uploadParameter.bid = this.foreman.busiId
                    this.uploadParameter.attachType = res[0].attachType
                }
            }).then()
        },
        // 上传附件成功
        uploadSucceed() {
            this.getAccessoryList()
        }
    }
}
</script>

<style scoped lang="scss">
.content {
    // 文本域
    .textarea {
        border: none;
        padding: 40rpx 30rpx;
        background: #f4f5f7;
        border-radius: 16rpx;
        /deep/.uni-textarea-textarea {
        font-size: 28rpx !important;
        }
    }
}
</style>
